<link rel="stylesheet" href="__CDN__/assets/addons/drama/libs/element/element.css">
<style>
    #goodsIndex {
        background: #fff;
        padding: 0 20px;
        overflow: auto;
        color: #666;

    }

    .btn-common {
        line-height: 32px;
        height: 32px;
        cursor: pointer;
        border-radius: 4px;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .btn-box {
        display: flex;
        align-items: center;
        margin-bottom: 20px;
        justify-content: space-between;
    }

    .refresh-btn {
        width: 32px;
        border: 1px solid #E6E6E6;
        font-size: 14px;
        margin-right: 20px;
    }

    .create-goods,
    .add-params,
    .add-level1-sku {
        width: 98px;
        background: #7536D0;
        color: #fff;
    }

    .add-tags {
        line-height: 32px;
        height: 32px;
        cursor: pointer;
        border-radius: 4px;
        display: flex;
        align-items: center;
        justify-content: center;
        width: 32px;
        background: #7536D0;
        color: #fff;
    }

    .create-goods span,
    .add-params span,
    .add-level1-sku span {
        margin-left: 8px;
    }

    .goods-name {
        display: flex;
        align-items: center;
    }

    .goods-img {
        width: 34px;
        height: 34px;
        margin-right: 10px;
    }

    .el-table,
    .el-table thead,
    .el-table th {
        color: #444;
        font-weight: 500 !important;
    }


    /* el-dialog */
    .el-dialog {
        width: 800px;
        height: 70vh;
        margin: 15vh auto;

    }

    .goods-dialog-big {
        width: 100vw;
        height: 100vh;
        margin: 0 auto;
        margin-top: 0 !important;
    }

    .goods-dialog-big .good-detail-body {
        height: calc(100vh - 200px);
        overflow: auto;
    }

    .el-dialog__header {
        padding: 16px 20px 10px;
    }

    .el-dialog__title {
        font-size: 14px;
        color: #444;
    }

    .el-dialog__headerbtn {
        font-size: 14px;
        color: #999;
    }

    .el-dialog__body {
        padding: 0;
    }

    .el-step.is-simple .el-step__title {
        font-size: 14px;
        font-weight: 600;
    }

    .el-step.is-simple .el-step__icon {
        display: none;
    }

    .el-step__title.is-finish {
        color: #7438D5;
    }

    .el-step__title.is-process {
        color: #666;
        font-weight: 500;
    }

    .el-step__title.is-wait {
        color: #999;
    }

    .el-form-item {
        margin-bottom: 20px;
    }

    .good-detail-body {
        padding: 20px 25px 10px 5px;
        height: calc(100vh - 120px);
        overflow: auto;
    }

    .good-detail-body::-webkit-scrollbar {
        width: 6px;
    }

    .good-detail-body::-webkit-scrollbar-thumb {
        width: 6px;
        background: #e6e6e6;
        height: 20px;
        border-radius: 3px;
    }

    .goods-type {
        width: 162px;
        height: 58px;
        border-radius: 4px;
        position: relative;
        margin-right: 20px;
    }

    .goods-type-img {
        border-radius: 4px;
    }

    .goods-type-selected {
        width: 16px;
        height: 16px;
        line-height: 16px;
        text-align: center;
        border-radius: 50%;
        background: #7438D5;
        color: #fff;
        font-weight: 600;
        font-size: 14px;
        display: none;
        position: absolute;
        top: -8px;
        right: -8px;
    }

    .el-input__inner,
    .el-input__icon {
        line-height: 34px;
        height: 34px;
    }

    .display-flex {
        display: flex;
        align-items: center;
    }

    .add-img {
        width: 60px;
        height: 60px;
        border: 1px dashed #E6E6E6;
        border-radius: 4px;
        justify-content: center;
        margin-right: 30px;
        margin-bottom: 10px;
    }

    label {
        margin-bottom: 0;
    }

    .msg-tip {
        margin-left: 30px;
        color: #999;
    }

    .dialog-footer {
        display: flex;
        justify-content: flex-end;
        padding: 0 30px;
    }

    .back-btn {
        width: 88px;
        height: 36px;
        line-height: 36px;
        text-align: center;
        margin-right: 20px;
        color: #999;
        cursor: pointer;
    }

    .sub-btn {
        width: 88px;
        height: 36px;
        line-height: 36px;
        text-align: center;
        background: #7438D5;
        font-size: 14px;
        color: #fff;
        cursor: pointer;
    }

    .goods-detail-table {
        border: 1px solid #E6E6E6;
        border-bottom: none;
        margin-bottom: 20px;
    }

    .goods-detail-item {
        border-bottom: 1px solid #E6E6E6;
    }

    .goods-detail-item>div {
        padding: 5px 10px;
    }

    .goods-detail-name {
        width: 120px;
    }

    .goods-detail-msg {
        width: 378px;
    }

    .goods-detail-del,
    .goods-detail-move {
        width: 50px;
        display: flex;
        justify-content: center;
    }

    .goods-detail-del-icon {
        color: #ff5959;
    }

    .del-image-btn {
        position: absolute;
        width: 14px;
        height: 14px;
        line-height: 14px;
        text-align: center;
        border-radius: 50%;
        font-size: 12px;
        font-weight: 600;
        background: #7438D5;
        color: #fff;
        top: -7px;
        right: -7px;
    }

    .goods-images {
        width: 60px;
        height: 60px;
        border-radius: 4px;
        position: relative;
        border: 1px solid #7438D5;
        margin-right: 10px;
        margin-bottom: 10px;
    }

    .label-auto {
        width: 100%;
        height: 100%;
    }

    .el-radio__input.is-checked+.el-radio__label,
    .el-tabs__item.is-active,
    .el-tabs__item:hover,
    .el-pager li.active,
    .el-cascader-node.in-active-path,
    .el-cascader-node.is-active,
    .el-cascader-node.is-selectable.in-checked-path,
    .el-checkbox__input.is-checked+.el-checkbox__label,
    .el-select-dropdown.is-multiple .el-select-dropdown__item.selected {
        color: #7438D5;
    }

    .el-radio__input.is-checked .el-radio__inner,
    .el-tabs__active-bar,
    .el-checkbox__input.is-checked .el-checkbox__inner,
    .el-checkbox__input.is-indeterminate .el-checkbox__inner {
        background: #7438D5;
        border-color: #7438D5;
    }

    .add-sku-box {
        padding: 10px 8px;
        border: 1px solid #E6E6E6;
    }

    .sku-item {
        background: #F9F9F9;
        height: 50px;
        padding: 10px;
    }

    .sku-item-level {
        height: auto;
    }

    .sku-item-level2 {
        height: auto;
        padding: 0;
        width: 600px;
        background: #fff;
        display: flex;
        flex-wrap: wrap;
        line-height: 30px;
    }

    .sku-children {
        margin-right: 18px;
        position: relative;
        width: 120px;
        margin-bottom: 10px;
    }

    .sku-children-del {
        width: 16px;
        height: 16px;
        border-radius: 50%;
        position: absolute;
        top: -8px;
        right: -8px;
        background: #7536D0;
        color: #fff;
        font-weight: 600;
        justify-content: center;
    }

    .sku-img {
        width: 34px;
        height: 34px;
        border-radius: 4px;
        position: relative;
    }

    .sku-img i {
        width: 14px;
        height: 14px;
        border-radius: 50%;
        position: absolute;
        top: -7px;
        right: -7px;
        background: #7536D0;
        color: #fff;
        font-weight: 600;
        justify-content: center;
        font-size: 12px;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .table-box {
        border: 1px solid #E6E6E6;
        margin: 20px 0;
        overflow-x: auto;
    }

    .table-box .table {
        table-layout: auto;
        margin: 0;
    }

    .table-box .table td,
    .table-box .table th {
        white-space: nowrap;
        min-width: 80px;
    }

    .table-upload-img {
        width: 34px;
        height: 34px;
        color: #E6E6E6;
        border-radius: 2px;
        border: 1px solid #E6E6E6;
        display: flex;
        justify-content: center;
        align-items: center;
    }

    .all-edit-img {
        width: 14px;
        height: 14px;
        margin-left: 6px;
    }

    .sku-status {
        cursor: pointer;
    }

    .el-dialog__body .table {
        font-size: 12px;
        margin-bottom: 0;
    }

    .th-center {
        height: 34px;
        line-height: 34px;
    }

    .w-e-toolbar {
        display: flex;
        flex-wrap: wrap;
    }

    .el-cascader,
    .el-select {
        width: 100%;
    }

    .el-popover .el-input {
        margin-bottom: 10px;
    }

    .el-button--primary,
    .el-button--primary:hover {
        color: #FFF;
        background-color: #7536D0;
        border-color: #7536D0;
    }

    .el-popover .el-button--text {
        color: #7536D0;
    }

    .color-999 {
        color: #999;
    }

    .popover-container>p {
        margin-bottom: 10px;
    }

    .question-tip {
        font-size: 24px;
        color: #ccc;
        margin-left: 18px;
    }

    .el-radio {
        margin-right: 10px;
    }

    .flex-1 {
        flex: 1;
    }

    .create-template {
        margin-left: 44px;
        cursor: pointer;
        color: #7536D0;
    }

    .el-tabs__content {
        height: 190px;
        overflow: auto;
    }

    .category-inputs input,
    .category-inputs:focus input,
    .category-inputs:hover input {
        background: none;
        border: none;
        border-color: rgba(0, 0, 0, 0) !important;
    }

    .nice-validator .el-input__inner {
        vertical-align: baseline !important;
    }

    .table-stock-warning-switch {
        line-height: 32px;
        height: 32px;
        margin-right: 8px;
    }

    .table-input {
        width: 80px;
    }

    .stock-warning-switch-tip {
        margin-left: 30px;
        color: #999;
        font-size: 12px;
    }

    .table-stock-warning-switch-tip {
        margin-left: 8px;
    }

    [v-cloak] {
        display: none
    }
</style>
<script src="__CDN__/assets/addons/drama/libs/vue.js"></script>
<script src="__CDN__/assets/addons/drama/libs/element/element.js"></script>
<script src="__CDN__/assets/addons/drama/libs/Sortable.min.js"></script>
<script src="__CDN__/assets/addons/drama/libs/vuedraggable.js"></script>
<script src="__CDN__/assets/addons/drama/libs/moment.js"></script>
<div id="videoDetail" v-cloak style="height: calc(100vh - 63px);" @click.stop="openCategory(0)">
    <div class="preview-body">
        <el-steps :active="stepActive" simple>
            <el-step title="1、基础信息"></el-step>
            <el-step title="2、演员/剧集"></el-step>
            <el-step title="3、短剧详情"></el-step>
        </el-steps>
        <div class="good-detail-body">
            <el-form :model="videoDetail" :rules="rules" ref="videoDetail" label-width="110px" class="demo-videoDetail">
                <div v-if="stepActive==1">
                    <el-form-item label="短剧标题：" prop="title">
                        <el-input type="input" v-model="videoDetail.title" size="small"></el-input>
                    </el-form-item>
                    <el-form-item label="副标题：" prop="subtitle">
                        <el-input type="input" v-model="videoDetail.subtitle" size="small"></el-input>
                    </el-form-item>

                    <el-form-item label="短剧标志：">
                        <div class="display-flex">
                            <div class="flex-1">
                                <el-select v-model="timeData.flags_arr" placeholder="请选择" multiple size="small" @change="flagsChange">
                                    <el-option v-for="(key, item) in flagsOptions" :label="key"
                                               :value="item">
                                    </el-option>
                                </el-select>
                            </div>
                        </div>
                    </el-form-item>

                    <el-form-item label="短剧状态：" prop="status">
                        <el-radio-group v-model="videoDetail.status">
                            <el-radio label="up">上架</el-radio>
                            <el-radio label="down">下架</el-radio>
                        </el-radio-group>
                    </el-form-item>
                    <el-form-item label="排序：" prop="weigh">
                        <div class="display-flex">
                            <el-input type="number" v-model="videoDetail.weigh" style="width:300px;" size="small">
                            </el-input>
                            <div class="msg-tip">排序的大小默认按照从大到小排列</div>
                        </div>
                    </el-form-item>
                    <el-form-item label="短剧封面：" prop="image">
                        <div class="display-flex">
                            <div class="goods-image-box display-flex" v-if="videoDetail.image">
                                <div class="goods-images" style="margin-right: 0;">
                                    <img class="label-auto" :src="Fast.api.cdnurl(videoDetail.image)"
                                         style="border-radius: 4px;">
                                    <div class="del-image-btn" @click="delImg('image',null)">
                                        <img class="label-auto" src="/assets/addons/drama/img/close.png">
                                    </div>
                                </div>
                            </div>
                            <div class="add-img display-flex" @click="addImg('image',null,false)"
                                 v-if="!videoDetail.image">
                                <i class="el-icon-plus"></i>
                            </div>
                            <div class="msg-tip">作用于列表、分享头图；建议尺寸：750*750像素</div>
                        </div>
                    </el-form-item>
                    <el-form-item label="短剧分类：">
                        <div class="display-flex">
                            <el-popover placement="bottom-start" width="600" v-model="popperVisible">
                                <div @click.stop="openCategory(1)">
                                    <el-tabs v-if="categoryOptions && categoryOptions.length>0" v-model="tempTabsId">
                                        <el-tab-pane v-for="tab in categoryOptions" :key="tab" :label="tab.name"
                                                     :name="tab.id + ''">
                                            <el-cascader-panel v-model="tempCategory.idsArr[tab.id]"
                                                               :ref="`categoryRef-${tab.id + '-' + tab.name}`" :options="tab.children"
                                                               :props="{
                                      multiple: true,
                                      checkStrictly: true,
                                      value: 'id',
                                      label: 'name',
                                      children: 'children',
                                      emitPath: false,
                                    }" @change="changeCategoryIds">
                                            </el-cascader-panel>
                                        </el-tab-pane>
                                    </el-tabs>
                                    <div style="width: 100%;text-align: center;"
                                         v-if="categoryOptions && categoryOptions.length==0">没有分类,请选择去创建</div>
                                </div>
                                <template #reference>
                                    <div class="display-flex" @click.stop="openCategory"
                                         style="flex-wrap: wrap;border: 1px solid #e6e6e6;border-radius: 4px;padding: 0 5px">
                                        <div style="margin-right: 5px;
                          bottom: 5px;
                          height: 28px;
                          line-height: 28px;
                          padding: 0 5px;
                          border: 1px solid #e6e6e6;
                          border-radius: 4px;background: #f9f9f9;" v-for="(tag,key) in tempCategory.label" :key="tag">
                                            {{tag}}
                                            <i class="el-icon-close" @click.stop="deleteCategoryIds(key)"></i>
                                        </div>
                                        <el-input class="category-inputs" size="mini" @focus="getCategoryOptions()"
                                                  style="background: none;border: none;width: 120px;height: 34px;"></el-input>
                                    </div>
                                </template>
                            </el-popover>
                            <div style="cursor: pointer;color: #7438D5;margin-left: 30px;flex-shrink: 0;"
                                 @click="createCategory">新建分类
                            </div>
                        </div>
                    </el-form-item>
                    <el-form-item label="短剧地区：" prop="area_id">
                        <div class="display-flex">
                            <div class="flex-1">
                                <el-select v-model="videoDetail.area_id" placeholder="请选择" size="small">
                                    <el-option v-for="item in areaOptions" :key="item.id" :label="item.name"
                                               :value="item.id">
                                    </el-option>
                                </el-select>
                            </div>
                        </div>
                    </el-form-item>
                    <el-form-item label="短剧年份：" prop="year_id">
                        <div class="display-flex">
                            <div class="flex-1">
                                <el-select v-model="videoDetail.year_id" placeholder="请选择" size="small">
                                    <el-option v-for="item in yearOptions" :key="item.id" :label="item.name"
                                               :value="item.id">
                                    </el-option>
                                </el-select>
                            </div>
                        </div>
                    </el-form-item>
                    <el-form-item label="整剧价格：" prop="price">
                        <div class="display-flex">
                            <el-input v-enter-number type="number" v-model="videoDetail.price" style="width:300px"
                                      size="small">
                                <template slot="append">积分</template>
                            </el-input>
                            <div class="msg-tip">短剧没有VIP的情况下整剧的价格</div>
                        </div>
                    </el-form-item>
                    <el-form-item label="VIP价格：" prop="vprice">
                        <div class="display-flex">
                            <el-input v-enter-number type="number" v-model="videoDetail.vprice"
                                      style="width:300px" size="small">
                                <template slot="append">积分</template>
                            </el-input>
                            <div class="msg-tip">短剧在有VIP的情况下整剧的价格</div>
                        </div>
                    </el-form-item>
                    <el-form-item label="短剧总集数：" prop="episodes">
                        <el-input type="number" v-model="videoDetail.episodes" size="small"></el-input>
                    </el-form-item>
                    <el-form-item label="短剧评分：" prop="score">
                        <el-input type="number" v-model="videoDetail.score" size="small"></el-input>
                    </el-form-item>
                </div>
                <div v-if="stepActive==2">
                    <div class="table-box">
                        <table class="table">
                            <thead>
                            <tr>
                                <th>头像</th>
                                <th>姓名</th>
                                <th>英文名</th>
                                <th>标签</th>
                                <th>简介</th>
                                <th>饰演</th>
                                <th>排序</th>
                                <th>删除</th>
                            </tr>
                            </thead>
                            <tbody>
                            <tr v-for="(item, i) in videoPerformer" :key="i">
                                <td>
                                    <div class="display-flex table-upload-img">
                                        <div class="sku-img" v-if="item.avatar">
                                            <img :src="Fast.api.cdnurl(item.avatar)" class="label-auto">
                                            <i class="el-icon-close" @click="delImg('performer',i)"></i>
                                        </div>
                                        <div v-else @click="addImg('performer',i,false)">
                                            <i class="el-icon-plus" style="font-size:18px;"></i>
                                        </div>
                                    </div>
                                </td>
                                <td>
                                    <el-input class="table-input" v-model="item.name">
                                    </el-input>
                                </td>
                                <td>
                                    <el-input class="table-input" v-model="item.en_name">
                                    </el-input>
                                </td>
                                <td>
                                    <div  class="display-flex">
                                        <div  class="display-flex">
                                            <el-tag
                                                    size='medium'
                                                    :key="tag"
                                                    v-for="tag in item.tags_arr"
                                                    closable
                                                    :disable-transitions="false"
                                                    @close="tagCloseItem(i, tag)">
                                                {{tag}}
                                            </el-tag>
                                        </div>
                                        <div class="display-flex" v-if="item.tags_arr.length<3">
                                            <el-popover placement="top" width="160" v-model="allEditPopoverItems[i].tag">
                                                <el-input v-model="allEditItems" placeholder="请输入标签" size="small">
                                                </el-input>
                                                <div style="text-align: right; margin: 0">
                                                    <el-button size="mini" type="text"
                                                               @click="allEditItem('tag','cancel', i)">取消</el-button>
                                                    <el-button type="primary" size="mini"
                                                               @click="allEditItem('tag','define', i)">确定</el-button>
                                                </div>
                                                <div slot="reference" class="add-tags">
                                                    <i class="el-icon-plus"></i>
                                                </div>
                                            </el-popover>
                                        </div>
                                    </div>
                                </td>
                                <td>
                                    <el-input style="width: 160px" v-model="item.profile">
                                    </el-input>
                                </td>
                                <td>
                                    <div class="display-flex">
                                        <el-radio-group v-model="item.type">
                                            <el-radio label="director">导演</el-radio>
                                            <el-radio label="performer">演员</el-radio>
                                        </el-radio-group>
                                        <el-input class="table-input"  placeholder="饰演角色"
                                                  v-if="item.type=='performer'" v-model="item.play">
                                        </el-input>
                                    </div>
                                </td>
                                <td>
                                    <el-input class="table-input" v-model="item.weigh" type="number" min="0" @change="changeVideoPerformer">
                                    </el-input>
                                </td>
                                <td>
                                    <div style="width: 20px;height: 20px;" @click="delVideoPerformer(i)">
                                        <img class="label-auto" src="/assets/addons/drama/img/close.png">
                                    </div>
                                </td>
                            </tr>
                            </tbody>
                        </table>
                    </div>
                    <div class="btn-common add-params" @click="addVideoPerformer">
                        <i class="el-icon-plus"></i>
                        <span>添加演员</span>
                    </div>
                    <div class="table-box">
                        <table class="table">
                            <thead>
                            <tr>
                                <th>图片</th>
                                <th>名称</th>
                                <th>
                                    <div class="display-flex">
                                        <span>价格(积分)</span>
                                        <el-popover placement="top" width="160" v-model="allEditPopover.price">
                                            <el-input v-enter-number v-model="allEditDatas" placeholder="请输入内容"
                                                      size="small">
                                            </el-input>
                                            <div style="text-align: right; margin: 0">
                                                <el-button size="mini" type="text"
                                                           @click="allEditData('price','cancel')">取消</el-button>
                                                <el-button type="primary" size="mini"
                                                           @click="allEditData('price','define')">确定</el-button>
                                            </div>
                                            <div slot="reference">
                                                <img class="all-edit-img"
                                                     src="/assets/addons/drama/img/batch.png">
                                            </div>
                                        </el-popover>
                                    </div>
                                </th>
                                <th>
                                    <div class="display-flex">
                                        <span>VIP价格(积分)</span>
                                        <el-popover placement="top" width="160" v-model="allEditPopover.vprice">
                                            <el-input v-enter-number v-model="allEditDatas" placeholder="请输入内容"
                                                      size="small">
                                            </el-input>
                                            <div style="text-align: right; margin: 0">
                                                <el-button size="mini" type="text"
                                                           @click="allEditData('vprice','cancel')">取消</el-button>
                                                <el-button type="primary" size="mini"
                                                           @click="allEditData('vprice','define')">确定</el-button>
                                            </div>
                                            <div slot="reference">
                                                <img class="all-edit-img"
                                                     src="/assets/addons/drama/img/batch.png">
                                            </div>
                                        </el-popover>
                                    </div>
                                </th>
                                <th>视频</th>
                                <th>时长(秒)</th>
                                <th>排序</th>
                                <th>状态</th>
                                <th>
                                    <div class="display-flex">
                                        <span>虚拟点赞量</span>
                                        <el-popover placement="top" width="160" v-model="allEditPopover.fake_likes">
                                            <el-input v-enter-number v-model="allEditDatas" placeholder="请输入内容"
                                                      size="small">
                                            </el-input>
                                            <div style="text-align: right; margin: 0">
                                                <el-button size="mini" type="text"
                                                           @click="allEditData('fake_likes','cancel')">取消</el-button>
                                                <el-button type="primary" size="mini"
                                                           @click="allEditData('fake_likes','define')">确定</el-button>
                                            </div>
                                            <div slot="reference">
                                                <img class="all-edit-img"
                                                     src="/assets/addons/drama/img/batch.png">
                                            </div>
                                        </el-popover>
                                    </div>
                                </th>
                                <th>
                                    <div class="display-flex">
                                        <span>虚拟播放量</span>
                                        <el-popover placement="top" width="160" v-model="allEditPopover.fake_views">
                                            <el-input v-enter-number v-model="allEditDatas" placeholder="请输入内容"
                                                      size="small">
                                            </el-input>
                                            <div style="text-align: right; margin: 0">
                                                <el-button size="mini" type="text"
                                                           @click="allEditData('fake_views','cancel')">取消</el-button>
                                                <el-button type="primary" size="mini"
                                                           @click="allEditData('fake_views','define')">确定</el-button>
                                            </div>
                                            <div slot="reference">
                                                <img class="all-edit-img"
                                                     src="/assets/addons/drama/img/batch.png">
                                            </div>
                                        </el-popover>
                                    </div>
                                </th>
                                <th>
                                    <div class="display-flex">
                                        <span>虚拟收藏量</span>
                                        <el-popover placement="top" width="160" v-model="allEditPopover.fake_favorites">
                                            <el-input v-enter-number v-model="allEditDatas" placeholder="请输入内容"
                                                      size="small">
                                            </el-input>
                                            <div style="text-align: right; margin: 0">
                                                <el-button size="mini" type="text"
                                                           @click="allEditData('fake_favorites','cancel')">取消</el-button>
                                                <el-button type="primary" size="mini"
                                                           @click="allEditData('fake_favorites','define')">确定</el-button>
                                            </div>
                                            <div slot="reference">
                                                <img class="all-edit-img"
                                                     src="/assets/addons/drama/img/batch.png">
                                            </div>
                                        </el-popover>
                                    </div>
                                </th>
                                <th>
                                    <div class="display-flex">
                                        <span>虚拟转发量</span>
                                        <el-popover placement="top" width="160" v-model="allEditPopover.fake_shares">
                                            <el-input v-enter-number v-model="allEditDatas" placeholder="请输入内容"
                                                      size="small">
                                            </el-input>
                                            <div style="text-align: right; margin: 0">
                                                <el-button size="mini" type="text"
                                                           @click="allEditData('fake_shares','cancel')">取消</el-button>
                                                <el-button type="primary" size="mini"
                                                           @click="allEditData('fake_shares','define')">确定</el-button>
                                            </div>
                                            <div slot="reference">
                                                <img class="all-edit-img"
                                                     src="/assets/addons/drama/img/batch.png">
                                            </div>
                                        </el-popover>
                                    </div>
                                </th>
                                <th>删除</th>
                            </tr>
                            </thead>
                            <tbody>
                            <tr v-for="(item, i) in videoEpisodes" :key="i">
                                <td>
                                    <div class="display-flex table-upload-img">
                                        <div class="sku-img" v-if="item.image">
                                            <img :src="Fast.api.cdnurl(item.image)" class="label-auto">
                                            <i class="el-icon-close" @click="delImg('episodes_image',i)"></i>
                                        </div>
                                        <div v-else @click="addImg('episodes_image',i,false)">
                                            <i class="el-icon-plus" style="font-size:18px;"></i>
                                        </div>
                                    </div>
                                </td>
                                <td>
                                    <el-input class="table-input" v-model="item.name">
                                    </el-input>
                                </td>
                                <td>
                                    <el-input v-enter-number class="table-input" v-model="item.price">
                                    </el-input>
                                </td>
                                <td>
                                    <el-input v-enter-number class="table-input" v-model="item.vprice">
                                    </el-input>
                                </td>
                                <td>
                                    <div class="display-flex table-upload-img">
                                        <div class="sku-img" v-if="item.video">
                                            <img :src="'icon?suffix='+item.suffix" class="label-auto">
                                            <i class="el-icon-close" @click="delImg('episodes_video',i)"></i>
                                        </div>
                                        <div v-else @click="addImg('episodes_video',i,false)">
                                            <i class="el-icon-plus" style="font-size:18px;"></i>
                                        </div>
                                    </div>
                                </td>
                                <td>
                                    <el-input class="table-input" v-model="item.duration" type="number" min="0" :disabled="true">
                                    </el-input>
                                </td>
                                <td>
                                    <el-input class="table-input" v-model="item.weigh" type="number" min="0" @change="changeVideoEpisodes">
                                    </el-input>
                                </td>
                                <td>
                                            <span class="sku-status th-center" @click="editStatus(i)">
                                                {{item.status=='normal'?'正常':'隐藏'}}
                                            </span>
                                </td>
                                <td>
                                    <el-input v-enter-number class="table-input" v-model="item.fake_likes">
                                    </el-input>
                                </td>
                                <td>
                                    <el-input v-enter-number class="table-input" v-model="item.fake_views">
                                    </el-input>
                                </td>
                                <td>
                                    <el-input v-enter-number class="table-input" v-model="item.fake_favorites">
                                    </el-input>
                                </td>
                                <td>
                                    <el-input v-enter-number class="table-input" v-model="item.fake_shares">
                                    </el-input>
                                </td>
                                <td>
                                    <div style="width: 20px;height: 20px;" @click="deleteVideoEpisodes(i)">
                                        <img class="label-auto" src="/assets/addons/drama/img/close.png">
                                    </div>
                                </td>
                            </tr>
                            </tbody>
                        </table>
                    </div>
                    <div v-if="videoDetail.episodes>videoEpisodes.length" class="btn-common add-params" @click="addVideoEpisodes">
                        <i class="el-icon-plus"></i>
                        <span>添加剧集</span>
                    </div>
                </div>
                <div v-if="stepActive==3">
                    <el-form-item label="短剧标签：">
                        <div  class="display-flex">
                            <div  class="display-flex">
                                <el-tag
                                        size='medium'
                                        :key="tag"
                                        v-for="tag in timeData.tags_arr"
                                        closable
                                        :disable-transitions="false"
                                        @close="tagClose(tag)">
                                    {{tag}}
                                </el-tag>
                            </div>
                            <div class="display-flex" v-if="timeData.tags_arr.length<5">
                                <el-popover placement="top" width="160" v-model="allEditPopoverTags.tag">
                                    <el-input v-model="allEditTags" placeholder="请输入标签"
                                              size="small">
                                    </el-input>
                                    <div style="text-align: right; margin: 0">
                                        <el-button size="mini" type="text"
                                                   @click="allEditTag('tag','cancel')">取消</el-button>
                                        <el-button type="primary" size="mini"
                                                   @click="allEditTag('tag','define')">确定</el-button>
                                    </div>
                                    <div slot="reference" class="add-tags">
                                        <i class="el-icon-plus"></i>
                                    </div>
                                </el-popover>
                            </div>
                        </div>
                    </el-form-item>
                    <el-form-item label="短剧描述：" prop="description">
                        <el-input type="textarea" v-model="videoDetail.description" rows="3" placeholder="请输入短剧描述" size="small"></el-input>
                    </el-form-item>
                </div>
                <form id="add-form" class="form-horizontal" role="form" data-toggle="validator" method="POST" action=""
                      v-show="stepActive==3">
                    <div class="display-flex" style="margin: 0;align-items: flex-start;">
                        <label class="control-label" style="width: 100px;
                        padding-right: 20px;
                        font-weight: 600;
                        font-size: 14px;
                        color: #606266;">{:__('Content')}:</label>
                        <div style="flex: 1;">
                            <textarea id="c-content" class="form-control editor" rows="5" name="row[content]"
                                      cols="50"></textarea>
                        </div>
                    </div>
                </form>
            </el-form>
        </div>
    </div>
    <span slot="footer" class="dialog-footer">
        <div class="back-btn" v-if="stepActive>1" @click="gonextback">上一步</div>
        <div class="btn-common sub-btn" v-if="stepActive<3" @click="gotoback('videoDetail')">下一步</div>
        <div class="btn-common sub-btn" v-if="stepActive==3" @click="submitForm('videoDetail')">确定</div>
    </span>
</div>